<template>
	<view class="fl-s-s">
		<view class="cart-list">
			<view class="cart-list w-1  relative m-t-30">
				<view class="" v-for="(items,indexs) in list">
					<view class="list-item " v-for="(item,index) in items.order_item" :key="index">
						<view class="fr-s-c w-1 m-b-20">
							<view class="fl-c h-1" style="width: 84rpx;" @click="changeChooseSign(indexs,index,item.can_buyback,items.is_overtime,item.is_buyback,item.is_withdraw,state )">
								<image
									:src="item.toggle?'/static/images/shopcar/color_selected.png':'/static/images/shopcar/noc_not_select.png'"
									style="width: 36rpx; height: 36rpx;"></image>
							</view>
							<view class="flex-1 h-1">
								<view class="list-item-top">
									<view class="">
										{{items.order_no}}
									</view>
									<view class="">
										{{items.createtime_text}}
									</view>
								</view>
								<view class="fr-s-c">
									<image :src="baseUrl.cdnurl+item.image" mode="aspectFill"
										style="width: 116rpx; height: 116rpx; border-radius: 12rpx;" v-if="item.platform == 0"></image>
										<image :src="item.image" mode="aspectFill"
											style="width: 116rpx; height: 116rpx; border-radius: 12rpx;" v-else></image>
									<view class="m-l-20 flex-1 fl-b-s" style="padding: 16rpx 0;">
										<text class="text-line-1 c-00 fs-30 fm-ali">{{item.title}}</text>
										<view class="fr-b-e w-1 margin20">
											<!-- 价格 -->
											<view class="fr-s-c fm-ali" style="color: #FA360A; align-items: baseline;">
												<text class="fs-24">还能卖￥</text>
												<text class="fs-36">{{item.price}}</text>
												<!-- <text class="fs-20">.00</text> -->
											</view>
											<!-- 修改数量 -->
											<!-- @plus="plusNum" -->
											<!-- <u-number-box v-model="item.num" :min="1" :index="index" bg-color="transparent" @change="valChange" ></u-number-box> -->
										</view>
									</view>
								</view>
							</view>
						</view>
						
						<!-- 判断不能换购 -->
						<view class="shangjia-bottom"  v-if="items.state == 9">
							寄错旧件，请重新寄，待审核通后可方可使用，具体联系客服
						</view>
						<view class="shangjia-bottom"  v-if="items.is_overtime == 0">
							过七天无理由方可换购
						</view>
						<view class="shangjia-bottom"  v-else-if="(item.is_buyback == 1||item.is_withdraw == 1) && item.can_buyback == 0 && items.is_overtime == 1">
							此商品已换购，不可再次换购
						</view>
					</view>
					
				</view>
			</view>
		</view>
		<view v-if="list.length" class="fr-c-s w-1 jiesuan">
			<view class="column-foot p-r-30 fr-b-c m-t-20">
				<view class="fr-s-c" @click="changeChooseAll">
					<image
						:src="chooseAll?'/static/images/shopcar/color_selected.png':'/static/images/shopcar/noc_not_select.png'"
						style="width: 36rpx; height: 36rpx;"></image>
					<text class="c-99 fs-30 fm-ali m-l-10">全选</text>
				</view>
				<view class="fr-s-c chat_bottom">
					已选择<text class="chat_num">{{num}}</text>件,
					<text class="fs-24 c-66 fm-ali" >合计</text>
					<view class="fr-s-c fm-ali"  style="color: #FA360A; align-items: baseline;">
						<text class="fs-24">￥</text>
						<text class="fs-36">{{account}}</text>
					</view>
					<view class="fr-c js-btn m-l-30"  @click="toSub">选择</view>
				</view>
			</view>
		</view>
		<!-- v-if="nodata" -->
		<!-- v-if="!list.length" -->
		<view class="m-t-50 w-1" v-if="!list.length">
			<u-empty mode="list"></u-empty>
			<!-- <view class="choose_img" @tap="choose_img">
				拍照上传
			</view>
			<view class="choose_img_text">
				暂无可选项，如有旧物，请拍照上传
			</view> -->
		</view>
	</view>
</template>

<script>
	import config from '@/utils/base.js';
	export default {
		data() {
			return {
				value: 1,
				isEdit: false,
				chooseAll: false,
				list: [],
				nodata: true,
				active_list:[],
				baseUrl:config,
				page:1,
			}
		},
		// watch: {
		// 	list: {
		// 		deep: true, //true为进行深度监听,false为不进行深度监听
		// 		handler(newVal) {
		// 			this.chooseAll = newVal.every(item => {
		// 				item.order_item.every(item1=> item.toggle)
		// 			})
		// 		}
		// 	}
		// },
		onLoad() {

		},
		onShow() {
			this.getList()
		},
		onReachBottom() {
			if(this.page < this.last_page){
				this.page++;
				this.getList()
			}else{
				uni.showToast({
					title:'已经到底了哦',
					icon:'none'
				})
			}
		},
		computed: {
			
			// 合计
			account() {
				let total = 0
				for(let item of this.list){
					item.order_item.filter(item1=> item1.toggle).map(i =>{
						total += 1 * i.price
					})
				}
				return total.toFixed(2)
			},
			num() {
				let num = 0
				for(let item of this.list){
					item.order_item.filter(item1=> item1.toggle).map(i =>{
						num++
					})
				}
				return num
			},
		},
		onNavigationBarButtonTap() {
			// this.choose_img()
			uni.redirectTo({
				url:'/pages/Home/GoodsDetail/ChooseOldStuff/choose_img/choose_img'
			})
		},
		methods: {
			async choose_img(){
				//#ifdef APP-PLUS				let result = await this.$store.dispatch("quanxian/requestPermissions",'WRITE_EXTERNAL_STORAGE')					console.log(result)				if (result !== 1) return
				this.$store.state.isCAMERA = true				// #endif
				
				let that = this
				uni.chooseImage({
					count: 1, //默认9
					sourceType: ['album', 'camera'], //从相册选择
					success: function(res) {
						console.log(res.tempFilePaths[0])
						that.$api.get({
							url: '/wanlshop/common/uploadData',
							success: updata => {
								console.log(updata)
								that.$api.upload({
									url: updata.data.uploadurl,
									filePath: res.tempFilePaths[0],
									name: 'file',
									formData: updata.data.storage == 'local' ? null : updata.data.multipart,
									success: res => {
										let resinfo = JSON.parse(res)
										console.log(resinfo)
										uni.$emit('imageList',resinfo.data.fullurl)
										uni.navigateBack()
										// that.head_img = resinfo.data.fullurl
									}
								});
							}
						});
					}
				});
			},
			getList() {
				let t = this
				t.$get({
					url: '/wanlshop/buyback/goods',
					data:{
						page:t.page,
						pageSize:10,
						from:'list2'
					},
				}).then(res => {
					console.log(res)
					if(res.code == 1){
						if (res.data.data.length>0) {
							res.data.data.map(item => {
								item.order_item.map(pp=>{
									pp.toggle = false
								})
							})
							t.list = res.data.data
							t.nodata = !t.list.length
						}
					}
				})
			},
			// 删除购物车数据
			delGoods() {
				uni.showModal({
					title: '提示',
					content: '确定删除选中商品吗？',
					success: res => {
						if (res.confirm) {
							let list = this.list
							list = list.filter(item => item.toggle).map(items => items = items.id)
							this.$get({
								url: '/mainwxapp/doPageDelGwcs',
								data: {
									gwc_ids: list.join(',')
								}
							}).then(res => {
								this.list = this.list.filter(item => !list.includes(item.id))
								this.nodata = !this.list.length
								if (!this.list.length) {
									this.isEdit = false
								}
							})
						}
					}
				})
			},
			plusNum(e) {
				console.log(e, '111')
			},
			valChange(e) {
				const {
					value,
					index
				} = e
				console.log(this.list[index].num)
				this.updataGnum(index)
			},
			// 修改购物车数量
			updataGnum(index) {
				let id = this.list[index].id
				let num = this.list[index].num
				this.$get({
					url: '/Wxapps/doPageduogwcchange',
					data: {
						id,
						num
					}
				})
			},
			changeEdit() {
				this.isEdit = !this.isEdit
			},
			getChooseAll(){
				let isall = true
				for(let item of this.list){
					for(let item1 of item.order_item){
						if(!item1.toggle){
							isall = false
						}
					}
				}
				
				this.chooseAll = isall
			},
			// 单选
			changeChooseSign(indexs,index,can_buyback,is_overtime,is_buyback,is_withdraw,state) {
				console.log(can_buyback,is_overtime)
				if(state == 9){
					uni.showToast({
						title:'寄错旧件，请重新寄，待审核通后可方可使用，具体联系客服',
						icon:'none'
					})
					return false
				}
				
				if(can_buyback == 1 && is_overtime == 0){
					uni.showToast({
						title:'过七天无理由方可换购',
						icon:'none'
					})
					return false
				}
				if(can_buyback == 0 && is_overtime == 1 && (is_buyback == 1 || is_withdraw == 1)){
					uni.showToast({
						title:'此商品已换购，不可再次换购',
						icon:'none'
					})
					return false
				}
				this.list[indexs].order_item[index].toggle = !this.list[indexs].order_item[index].toggle
				this.get_active_num()
				this.getChooseAll()
			},
			// 多选
			changeChooseAll() {
				let chooseAll = !this.chooseAll
				for(let item of this.list){
					for(let item1 of item.order_item){
						if(item.is_overtime == 0 && item1.can_buyback == 1){
							uni.showToast({
								title:'列表中包含过七天无理由方可换购商品',
								icon:'none'
							})
							return false
						}
						item1.toggle = chooseAll
						console.log(item1.toggle)
					}
				}
				this.chooseAll = chooseAll
				this.get_active_num()
			},
			get_active_num(){
				this.active_list = []
				console.log(this.list)
				for(let item of this.list){
					for(let item1 of item.order_item){
						if(item1.toggle == true){
							let data = {
								order_no:item.order_no,
								createtime_text:item.createtime_text,
								image:item1.image,
								order_id:item1.order_id,
								price:item1.price,
								title:item1.title,
								goods_id:item1.goods_id,
								shop_id:item1.shop_id,
								return:item.shop.return,
								sku_id:item1.goods_sku_id,
								original_order_id:item1.original_order_id,
								platform:item1.platform,
							}
							this.active_list.push(data)
						}
					}
				}
				// console.log(this.active_list)
				
			},
			// 去下单页
			toSub() {
				
				uni.$emit('jiuwulist',this.active_list)
				uni.navigateBack()
			}
		}
	}
</script>

<style>
	page {
		background-color: #fff;
		padding-bottom: 220rpx;
	}

	.cart-list {
		width: 100%;
	}

	>>>.u-numberbox {
		border: 2rpx solid #EEEEEE !important;
		width: 130rpx !important;
		height: 42rpx !important;
		border-radius: 6rpx !important;
		font-family: Alibaba !important;
	}

	>>>.u-number-input {
		font-family: Alibaba;
		font-size: 22rpx;
		color: #000000;
		width: 46rpx !important;
		height: 42rpx !important;
		margin: 0 !important;
		border: none;
		border-radius: 0;
		border-left: 2rpx solid #EEEEEE;
		border-right: 2rpx solid #EEEEEE;
	}

	>>>.u-icon-minus {
		width: 42rpx !important;
		height: 42rpx !important;
		color: #C0C0C0 !important;
	}

	>>>.u-icon-plus {
		width: 42rpx !important;
		height: 42rpx !important;
		color: #C0C0C0 !important;
	}

	.common_bg {
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 284rpx;
	}

	.list-item {
		width: 100%;
		/* height: 220rpx; */
		background: #FFFFFF;
		border-radius: 40rpx 40rpx 0 0;
		padding: 28rpx 48rpx;
		padding-left: 0;
		border-bottom: #F4F4F4 solid 2rpx;
	}

	.column-foot {
		width: 100%;
		height: 104rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
	}

	.js-btn {
		width: 104rpx;
		height: 66rpx;
		background: linear-gradient(270deg, #E46C30 0%, #E32C1C 100%);
		/* box-shadow: 0rpx 6rpx 32rpx 2rpx rgba(250, 74, 20, 0.58); */
		border-radius: 34rpx;
		font-size: 24rpx;
		font-family: Alibaba PuHuiTi 2.0-55 Regular, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #FFFFFF;
	}

	.jiesuan {
		width: 100%;
		height: 184rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		background-color: #fff;
		box-shadow: 0rpx -8rpx 14rpx 0rpx rgba(0, 0, 0, 0.06);
		border-bottom: 2rpx solid #F4F4F4;
	}

	.chat_bottom {
		font-size: 24rpx;
		font-family: Alibaba PuHuiTi 2.0-55 Regular, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #333333;
	}

	.chat_num {
		color: #E32D1D;
	}

	.margin20 {
		margin-top: 20rpx;
	}

	.list-item-top {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.list-item-top-img {
		width: 30rpx;
		height: 30rpx;
		background-color: #ddd;
		border-radius: 50%;
		margin-right: 6rpx;
	}

	.text-line-1 {
		display: -webkit-box;
		word-break: break-all;
		text-overflow: ellipsis;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		overflow: hidden;
	}
	.choose_img{
		width: 300rpx;
		height: 90rpx;
		border-radius: 20rpx;
		background: linear-gradient(180deg, #4ECC81 0%, #34B806 100%);
		color: #fff;
		line-height: 90rpx;
		text-align: center;
		margin: 0 auto;
	}
	.choose_img_text{
		width: 100%;
		text-align: center;
		font-size: 32rpx;
		font-family: Alibaba PuHuiTi 2.0-65 Medium, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #333333;
		margin-top: 30rpx;
	}
	.shangjia-bottom{
		font-size: 22rpx;
		font-family: Alibaba PuHuiTi 2.0-65 Medium, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #E56D31;
		padding: 0 10rpx;
		margin-top: 20rpx;
		padding-left: 70rpx;
	}
</style>